<template>
  <div class="mainpage">
    <div class="showpart">
      <div class="showpartmain">
        <div class="showpartl">
          <el-carousel trigger="click" height="359px">
            <el-carousel-item v-for="item in 2" :key="item">
              <a href="javascript:void(0)">
                <h3 class="small"></h3>
              </a>
            </el-carousel-item>
          </el-carousel>
        </div>
        <div class="showpartr">
          <el-tabs type="border-card">
            <el-tab-pane label="综合">
              <p>《英雄联盟》网吧特权采买指引</p>
            </el-tab-pane>
            <el-tab-pane label="公告">
              <p>《英雄联盟》网吧特权采买指引</p>
            </el-tab-pane>
            <el-tab-pane label="活动">
              <p>《英雄联盟》网吧特权采买指引</p>
            </el-tab-pane>
          </el-tabs>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
export default {
  data: () => ({}),
  created () {},
  methods: {}
}
</script>
<style lang="less" scoped>
.mainpage {
  .showpart {
    height: 359px;
    width: 100%;
    .showpartmain {
      width: 1240px;
      height: 359px;
      margin: 0 auto;
      display: flex;
      justify-content: space-between;
      .showpartl {
        width: 780px;
        height: 359px;
        background-color: yellow;
      }
      .showpartr {
        width: 418px;
        height: 359px;
        background-color: green;
      }
    }
  }
  .el-carousel__item h3 {
    color: #475669;
    margin: 0;
    cursor: pointer;
    width: 780px;
    height: 359px;
  }
  .el-carousel__item:nth-child(2n) {
    background: url("../images/mainindex/2.jpg");
  }
  .el-carousel__item:nth-child(2n + 1) {
    background: url("../images/mainindex/1.png");
  }
}
</style>
